<template>
	<view class="charts-box">
		<qiun-data-charts type="column" :chartData="chartData" />
	</view>
</template>

<script lang="ts" setup>
	import { ref } from 'vue';
	import qiunDataCharts from '../../uni_modules/qiun-data-charts/components/qiun-data-charts/qiun-data-charts.vue';
	import { onReady } from '@dcloudio/uni-app'

	const chartData = ref([])

	const getList = () => {
		setTimeout(() => {
			let res = {
				categories: ["2016", "2017", "2018", "2019", "2020", "2021"],
				series: [
					{
						name: "目标值",
						data: [35, 36, 31, 33, 13, 34]
					},
					{
						name: "完成量",
						data: [18, 27, 21, 24, 6, 28]
					}
				]
			};
			chartData.value = JSON.parse(JSON.stringify(res));
		}, 500);
	}


	onReady(() => {
		getList()
	})
</script>

<style>
	.charts-box {
		width: 100%;
		height: 300px;
	}
</style>